<template>
	<view class="ikz-detail">
		<ikz-loading :css-data="loading_css"></ikz-loading>
		<view class="ikz-tips">
			<!--   <view class="ikz-tips-title">
       反馈意见
     </view> -->
			<view class="ikz-tips-box">
				<textarea v-model="form_data.content" class="ikz-tips-text"
					placeholder="输入您的意见反馈，我们会更好的为您提供服务！"></textarea>
			</view>
		</view>
		<view class="ikz-take">
			<ikz-updata @returnFiles="returnFiles" :show-data="updata_info"></ikz-updata>
		</view>
		<view class="btn-box">
			<view class="ikz-btn" @click="submit">
				提交
			</view>
		</view>
	</view>
</template>

<script>
	import ikzLoading from '@/pages/Component/Public/Loading/loading.vue';
	import ikzUpdata from '@/pages/Component/Public/Updata/public/updata/updata.vue';
	var app = getApp( );
	import ikz from '@/pages/Common/tools.js';
	export default {
		components: {
			ikzLoading,
			ikzUpdata
		},
		data( ) {
			return {
				nodes: '',
				loading_css: {
					display: 'flex',
				},
				updata_info: {
					title: '上传图片'
				},
				form_data: {
					content: '',
					pic: ''
				},
				files: [ ],
			};
		},
		onLoad( ) {
			this.loading_css.display = 'none';
		},
		methods: {
			returnFiles( e ) {
				this.files = e;
			},
			submit( ) {
				if ( !this.form_data.content ) {
					wx.showToast( {
						title: '请填写您的宝贵意见',
						icon: 'none',
						duration: 2000
					} )
					return false;
				}
				if ( this.files.length ) {
					this.upImg( 0, ( res ) => {
						this.upData( );
					} );
				} else {
					this.upData( );
				}
			},
			//上传图片
			upImg( index, fn ) {
				uni.showLoading( {
					title: '加载中'
				} )
				var that = this;
				var path = "/common/upload";
				var data = {}
				ikz.up( path, data, 'file', this.files[ index ], ( res ) => {
					var temp_result_data = JSON.parse( res.data );
					if ( temp_result_data.code ) {
						uni.hideLoading( );
						if ( that.form_data.pic ) {
							that.form_data.pic = that.form_data.pic + ',' + temp_result_data.data.url
						} else {
							that.form_data.pic = temp_result_data.data.url;
						}
						if ( that.files.length == ( index + 1 ) ) {
							fn( );
						} else {
							index++
							that.upImg( index, fn )
						}
					} else {
						uni.showModal( {
							title: '提示',
							content: temp_result_data.msg,
							showCancel: false,
							success: function( res ) {}
						} );
						uni.hideLoading( );
					}
				} )
			},
			upData( ) {
				var path = '/xyb/same/feedback_updata';
				var data = this.form_data;
				ikz.post( path, data, res => {
					if ( res.data.code ) {
						uni.showModal( {
							title: '提示',
							content: '您的反馈已收到，祝天天开心！',
							showCancel: false,
							success: function( res ) {
								uni.reLaunch( {
									url: '/pages/Personal/index',
								} )
							}
						} );
					} else {
						uni.showModal( {
							title: '提示',
							content: res.data.data,
							showCancel: false,
							success: function( res ) {}
						} );
					}

					// fn();
					// if(that.pull_status){
					// 	this.$emit("change",'pull');
					// }
				} );
			}
		}
	};
</script>

<style>
	page {
		width: 100%;
		height: 100%;
		background: #F3F3F3;
	}

	/* 其他 */
	.ikz-tips {
		box-sizing: border-box;
		padding: 20rpx;
		width: 95%;
		margin: 30rpx auto 0;
		background: #fff;
		border-radius: 15rpx;
		box-sizing: border-box;
	}

	.ikz-tips-box {
		margin-top: 20rpx;
		width: 100%;
		height: 200rpx;
	}

	.ikz-tips-text {
		box-sizing: border-box;
		padding: 10rpx;
		width: 100%;
		height: 200rpx;
		/* border: 1px solid #CCCCCC; */
		border-radius: 15rpx;
		font-size: 28rpx;
		box-sizing: border-box;
	}

	.ikz-take {
		box-sizing: border-box;
		/* padding: 30rpx; */
		width: 95%;
		margin: 30rpx auto 0;
		display: flex;
		align-items: center;
		justify-content: space-between;
		/* background: #fff; */
		border-radius: 15rpx;
	}

	/* 其他 */
	/* 底部 */
	.ikz-bottom {
		position: fixed;
		bottom: 0px;
		left: 0px;
		display: flex;
		align-items: center;
		width: 100%;
		height: 150rpx;
		background: #F3F3F3;
		z-index: 99;
	}

	.ikz-bottom-box {
		width: 95%;
		height: 100rpx;
		margin: 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background: #555555;
		border-bottom-left-radius: 60rpx;
		border-top-right-radius: 60rpx;
	}

	.ikz-bottom-price {
		margin-left: 50rpx;
		color: #fff;
		font-weight: 800;

	}

	.ikz-bottom-btn {
		box-sizing: border-box;
		padding: 0px 40rpx;
		height: 100rpx;
		line-height: 100rpx;
		color: #fff;
		border-bottom-left-radius: 60rpx;
		border-top-right-radius: 60rpx;
		background: linear-gradient(to right, #FBAB7E, #F8C66D);
	}

	/* 底部 */
	
	.btn-box{
		width: 100%;
		height: 176rpx;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		
	}
	.ikz-btn {
		width: 95%;
		height: 80rpx;
		margin: 14rpx auto;
		background: #247EFF;
		color: #fff;
		border-radius: 50rpx;
		text-align: center;
		line-height: 80rpx;
	}
</style>